<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../css/002reset.css">
    <link rel="stylesheet" href="../css/002main.css">
</head>

<body>

    <!--顶部header区域-->
    <div class="header-con">
        <!--顶部header的内容部分-->
        <div class="header">
            <h1 class="fl">欢迎来到天天生鲜!</h1>

            <!--header区域右侧内容-->
            <div class="fr">
                <!--登录后的用户名字-->
                <div class="fl username">
                    欢迎您：<a href="">张 山</a>
                </div>
                <!--未登录的状态-->
                <div class="fl unlogin">

                    <a href=""> 登录</a>
                    <span>|</span>
                    <a href="">注册</a>

                </div>
                <!--购物车和订单的链接-->
                <div class="fl">
                    <span>|</span>
                    <a href="">我的购物车</a>
                    <span>|</span>
                    <a href="">我的订单</a>
                </div>

            </div>

        </div>
    </div>
    <!--顶部header区域-->


    <!--logo search cart-->
    <!--上面的logo一排区域-->
    <div class="logo-con">
        <!--logo-->
        <img src="../images/016logo.png" alt="logo" class="logo fl">
        <!--搜索-->
        <div class="fl search-con">

            <input type="text" class="content fl" placeholder="搜索">
            <input type="button" value="搜索" class="btnsearch fl">


        </div>
        <!--购物车-->
        <div class="fr cart-con">
            <a href="" class="fl">我的购物车</a>
            <span class="fl">0</span>
        </div>
    </div>
    <!--上面的logo一排区域-->


    <!--全部商品分类一排的区域-->
    <div class="all-goods-type-con">
        <!--全部商品分类的内容区域-->
        <div class="all-goods-type">
            <h2 class="fl">全部商品分类</h2>
            <ul class="fl menu">
                <li><a href="">首页</a></li>
                <li><span>|</span></li>
                <li><a href="">手机生鲜</a></li>
                <li><span>|</span></li>
                <li><a href="">抽奖</a></li>
            </ul>
        </div>
    </div>
    <!--全部商品分类一排的区域-->

    <!--中间幻灯片的一排区域-->
    <div class="center-con">
        <!--分类的列表-->
        <ul class="typelist fl">
            <li><a href="">新鲜水果</a></li>
            <li class="li01"><a href="">海鲜水产</a></li>
            <li class="li02"><a href="">猪牛羊肉</a></li>
            <li class="li03"><a href="">禽类蛋品</a></li>
            <li class="li04"><a href="">新鲜蔬菜</a></li>
            <li class="li05"><a href="">速冻食品</a></li>
        </ul>

        <!--幻灯片-->
        <div class="slides-con fl">
            <!--6张图片-->
            <ul class="slides">
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
                <li><a href=""><img src="../images/016slide01.jpg" alt=""></a></li>
            </ul>
            <!--左箭头-->
            <div class="leftarrow"></div>
            <!--右箭头-->
            <div class="rightarrow"></div>
            <!--小圆点-->
            <ul class="points">
                <li class="active"></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>


        <!--广告图-->
        <div class="fl advs">
            <a href=""><img src="../images/016adv01.jpg" alt=""></a>
            <a href=""><img src="../images/016adv02.jpg" alt=""></a>
        </div>
    </div>
    <!--中间幻灯片的一排区域-->

    <!--商品整体区域-->
    <div class="all-goods-con clearfix">
        <!--商品标题的一排区域-->
        <div class="goods-title-con">
            <h3 class="fl">新鲜水果</h3>
            <span class="fl">|</span>
            <!--推荐商品-->
            <ul class="fl recommend">
                <li><a href="">鲜芒</a></li>
                <li><a href="">加州提子</a></li>
                <li><a href="">亚马逊牛油果</a></li>
            </ul>
            <a href="" class="more fr">查看更多 &gt;</a>
        </div>

        <!--商品-->
        <div class="goods-con">
            <a href="" class="banner fl"><img src="../images/016banner01.jpg" alt=""></a>
            <!--商品列表-->
            <ul class="fl goodslist">
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
            </ul>

        </div>
    </div>
    <!--商品整体区域-->

    <!--商品整体区域-->
    <div class="all-goods-con clearfix">
        <!--商品标题的一排区域-->
        <div class="goods-title-con">
            <h3 class="fl">新鲜水果</h3>
            <span class="fl">|</span>
            <!--推荐商品-->
            <ul class="fl recommend">
                <li><a href="">鲜芒</a></li>
                <li><a href="">加州提子</a></li>
                <li><a href="">亚马逊牛油果</a></li>
            </ul>
            <a href="" class="more fr">查看更多 &gt;</a>
        </div>

        <!--商品-->
        <div class="goods-con">
            <a href="" class="banner fl"><img src="../images/016banner02.jpg" alt=""></a>
            <!--商品列表-->
            <ul class="fl goodslist">
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
            </ul>

        </div>
    </div>
    <!--商品整体区域-->

    <!--商品整体区域-->
    <div class="all-goods-con clearfix">
        <!--商品标题的一排区域-->
        <div class="goods-title-con">
            <h3 class="fl">新鲜水果</h3>
            <span class="fl">|</span>
            <!--推荐商品-->
            <ul class="fl recommend">
                <li><a href="">鲜芒</a></li>
                <li><a href="">加州提子</a></li>
                <li><a href="">亚马逊牛油果</a></li>
            </ul>
            <a href="" class="more fr">查看更多 &gt;</a>
        </div>

        <!--商品-->
        <div class="goods-con">
            <a href="" class="banner fl"><img src="../images/016banner03.jpg" alt=""></a>
            <!--商品列表-->
            <ul class="fl goodslist">
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
            </ul>

        </div>
    </div>
    <!--商品整体区域-->

    <!--商品整体区域-->
    <div class="all-goods-con clearfix">
        <!--商品标题的一排区域-->
        <div class="goods-title-con">
            <h3 class="fl">新鲜水果</h3>
            <span class="fl">|</span>
            <!--推荐商品-->
            <ul class="fl recommend">
                <li><a href="">鲜芒</a></li>
                <li><a href="">加州提子</a></li>
                <li><a href="">亚马逊牛油果</a></li>
            </ul>
            <a href="" class="more fr">查看更多 &gt;</a>
        </div>

        <!--商品-->
        <div class="goods-con">
            <a href="" class="banner fl"><img src="../images/016banner04.jpg" alt=""></a>
            <!--商品列表-->
            <ul class="fl goodslist">
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
            </ul>

        </div>
    </div>
    <!--商品整体区域-->
    <!--商品整体区域-->
    <div class="all-goods-con clearfix">
        <!--商品标题的一排区域-->
        <div class="goods-title-con">
            <h3 class="fl">新鲜水果</h3>
            <span class="fl">|</span>
            <!--推荐商品-->
            <ul class="fl recommend">
                <li><a href="">鲜芒</a></li>
                <li><a href="">加州提子</a></li>
                <li><a href="">亚马逊牛油果</a></li>
            </ul>
            <a href="" class="more fr">查看更多 &gt;</a>
        </div>

        <!--商品-->
        <div class="goods-con">
            <a href="" class="banner fl"><img src="../images/016banner05.jpg" alt=""></a>
            <!--商品列表-->
            <ul class="fl goodslist">
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
                <li>
                    <h4>基围虾</h4>
                    <a href=""><img src="../images/016goods.jpg" alt=""></a>
                    <p>¥ 26.80</p>
                </li>
            </ul>

        </div>
    </div>
    <!--商品整体区域-->



</body>

</html>